<!--
 * @Author: 杜兜兜
 * @Date: 2025-03-03 13:39:11
 * @LastEditTime: 2025-04-10 11:14:41
 * @motto: Still water run deep
 * @Description: Modify here please
 * @FilePath: \hici_cloud_web\src\views\mes\pro\workorder\components\materialOutboundlist.vue
-->
<template>
  <el-dialog title="物料出库查询" :visible.sync="showFlag" :modal="false" width="90%" append-to-body>
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
      <el-form-item label="领料单编号" prop="issueCode">
        <el-input v-model="queryParams.attr1" placeholder="请输入领料单编号" clearable />
      </el-form-item>
      <el-form-item label="物料编码" prop="itemCode">
        <el-input v-model="queryParams.itemCode" placeholder="请输入物料编码" clearable />
      </el-form-item>
      <el-form-item label="物料名称" prop="issueCode">
        <el-input v-model="queryParams.itemName" placeholder="请输入物料名称" clearable />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>
    <el-table v-loading="loading" :data="dataList" height="calc(60vh)">
      <el-table-column label="序号" align="center" width="50px">
        <template slot-scope="scope">
          <span>{{ scope.$index + 1 }}</span>
        </template>
      </el-table-column>
      <el-table-column label="领料单编号" align="center" prop="attr1" />
      <el-table-column label="工单编号" align="center" prop="workorderCode" />
      <el-table-column label="物料编码" align="center" prop="itemCode" min-width="100">
        <template slot-scope="scope">
          <el-button size="mini" type="text" @click="getInnerList(scope.row)">{{
            scope.row.itemCode }}</el-button>
        </template>
      </el-table-column>
      <el-table-column label="物料名称" align="center" prop="itemName" min-width="100" />
      <el-table-column label="规格型号" align="center" prop="specification" min-width="180" />
      <el-table-column label="批次号" align="center" prop="batchCode" />
      <el-table-column label="领用数量" align="center" prop="quantityIssued" />
      <el-table-column label="出库数量" align="center" prop="outboundCount">
        <template slot-scope="scope">
          <span v-if="scope.row.isKeyPart == 0&&scope.row.outboundCount !=0 ">{{ scope.row.quantityIssued }}</span>
          <span v-else>{{ scope.row.outboundCount }}</span>
        </template>
      </el-table-column>
    </el-table>
    <!-- 二级画面 -->
    <el-dialog width="60%" title="物料明细" :visible.sync="innerVisible" append-to-body>
      <el-table v-loading="innerLoading" :data="innerDataList" height="calc(50vh)">
        <el-table-column label="序号" align="center" width="50px">
          <template slot-scope="scope">
            <span>{{ scope.$index + 1 }}</span>
          </template>
        </el-table-column>
        <el-table-column label="物料编码" align="center" prop="itemCode" min-width="100" />
        <el-table-column label="物料名称" align="center" prop="itemName" min-width="100" />
        <el-table-column label="规格型号" align="center" prop="specification" min-width="180" />
        <el-table-column label="序列号" align="center" prop="sequenceCode" min-width="100" />
        <el-table-column label="出库人" align="center" prop="createBy" min-width="100" />
        <el-table-column label="出库时间" align="center" prop="createTime" min-width="180" />
      </el-table>
    </el-dialog>
  </el-dialog>
</template>

<script>
import { OutboundSummaryList, OutboundDetailedList } from "@/api/mes/pro/workorder";
export default {
  name: "materialOutboundlist",
  dicts: ["mes_workorder_fmaterial_type"],
  data() {
    return {
      caseInfo: {},
      showFlag: false,
      loading: false,
      dataList: [],
      // 二级页面
      innerVisible: false,
      innerLoading: false,
      innerDataList: [],
      queryParams: {}//查询参数
      // 二级页面 end
    };
  },
  methods: {
    //搜索
    handleQuery() {
      this.getList()
    },
    //重置
    resetQuery() {
      this.queryParams = {}
      this.getList()
    },
    init(row) {
      console.log(row);
      this.caseInfo.workorderId = row.workorderId
      this.caseInfo.fMoEntryId = row.fmoEntryId
      this.showFlag = true
      this.getList();
    },
    /* 获取物料出库列表 */
    getList() {
      console.log(this.caseInfo.fMoEntryId);
      this.loading = true;
      let parm = {
        "workorderId": this.caseInfo.workorderId,
        "itemName": this.queryParams.itemName,
        "attr1": this.queryParams.attr1,
        "itemCode": this.queryParams.itemCode,
        "fMoEntryId": this.caseInfo.fMoEntryId
      }
      OutboundSummaryList(parm).then((res) => {
        this.dataList = res.rows || [];
        this.loading = false;
      }).catch(() => {
        this.dataList = []
        this.loading = true;
      });
    },
    /* 获取二级页面数据 */
    getInnerList(row) {
      if (!row.itemCode) return this.$message.warning('请选择物料编码')
      this.innerVisible = true
      this.innerLoading = true;
      // 参数：workorderId 生产工单ID、issueCode 领料单编号、itemCode 物料编码
      let params = {
        workorderId: this.caseInfo.workorderId,
        issueCode: row.issueCode,
        itemCode: row.itemCode
      }
      OutboundDetailedList(params).then((res) => {
        this.innerDataList = res.rows || [];
        this.innerLoading = false;
      }).catch(() => {
        this.innerDataList = []
        this.innerLoading = true;
      });
    },
  },
};
</script>
<style lang="scss" scoped></style>